/* 
自定义hook函数
收集点击的坐标
*/
import { ref, onMounted, onBeforeUnmount } from "vue";

export default function useClickPosition() {
  const x = ref(-1);
  const y = ref(-1);

  const handleClick = (event: MouseEvent) => {
    console.log("click...");
    x.value = event.pageX;
    y.value = event.pageY;
  };

  // 在挂载后
  onMounted(() => {
    // 给页面绑定点击监听, 收集坐标
    document.addEventListener("click", handleClick);
  });

  // 在卸载前, 解绑监听
  onBeforeUnmount(() => {
    document.removeEventListener("click", handleClick);
  });

  return {
    x,
    y,
  };
}
